<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
      .box {
        width: 200px;
        height: 200px;
        border: 1px solid #000;
      }
      .gogo {
        background-color: aqua;
        width: 120px;
        height: 30px;
        border: 5px;
      }
      .meimei {
        font-size: 24px;
        color: red;
      }
    </style>
</head>
<body>
  <div id="app" class="box gogo meimei">123</div>
    <script>
       function deepClone(source) {
        if(typeof source !== 'object') {
          throw new Error('source is required object')
        }
        const targetObj = Array.isArray(source) ? [] : {}
        for (const i in source) {
          if(source.hasOwnProperty(i)) {
            if(typeof source[i] === 'object') {
              targetObj[i] = Array.isArray(source[i]) ? [] : {}
              targetObj[i] = deepClone(source[i])
            }else {
              targetObj[i] = source[i]
            }
          }
        }
       }
    </script>
</body>
</html>